<template>
    <Modal v-model="finishOpen">
        <Form ref="finishForm" :model="finishForm" :rules="ruleInline">
            <FormItem label="故障描述" prop="breakdownInfo">
                <Input
                        v-model="finishForm.breakdownInfo"
                        type="textarea"
                        :rows="5"
                        placeholder="故障描述"
                ></Input>
            </FormItem>
            <FormItem label="维修描述" prop="repairInfo">
                <Input
                        v-model="finishForm.repairInfo"
                        type="textarea"
                        :rows="5"
                        placeholder="维修描述"
                ></Input>
            </FormItem>


            <FormItem>
                <Button type="primary" @click="handleSubmit('finishForm')">提交</Button>
            </FormItem>
        </Form>
        <div slot="footer"></div>

    </Modal>
</template>

<script>
    import {completeJob} from "@/api"

    export default {
        name: "finish-job-form",
        props: {
            value: {
                type: Boolean,
                default: false
            },
            orderId: {
                type: String
            },
            id: {
                type: Number
            }
        },
        data() {
            return {
                finishOpen: false,
                finishForm: {
                    id: 0,
                    orderId: '',
                    breakdownInfo: "",
                    repairInfo: ""
                },
                ruleInline: {
                    breakdownInfo: [
                        {required: true, message: '请输入故障描述', trigger: 'blur'},
                    ],

                    repairInfo: [
                        {required: true, message: '请输入维修描述', trigger: 'blur'}
                    ]
                }

            }
        },
        methods: {
            handleSubmit(ref) {
                this.$refs[ref].validate((valid) => {
                    if (valid) {
                        completeJob(this.finishForm).then(res => {
                            if (res && res.meta && res.meta.isSuccess) {
                                this.$Message.success('成功!');
                                this.finishOpen = !this.finishOpen
                                this.$emit("ok")
                            } else {
                                this.$Message.error('错误:' + res.meta.msg);
                                this.$emit("error")
                            }
                        })

                    } else {
                        this.$Message.error('格式错误!');
                        this.$emit("error")
                    }
                })
            }
        },
        watch: {
            finishOpen(v) {
                this.$emit('input', v)
            },
            value(v) {
                this.finishOpen = v
            },
            orderId(v) {
                this.finishForm.orderId = v
            },
            id(v) {
                this.finishForm.id = v
            }
        }
    }
</script>

<style scoped>

</style>
